理解vue的渲染watch、compute
这篇文章将带大家全面理解vue的渲染watcher、computed和user watcher，其实computed和user watcher都是基于Watcher来实现的，我们通过一个一个功能点去敲代码，让大家全面理解其中的实现原理和核心思想。所以这篇文章将实现以下这些功能点：实现数据响应式基于渲染wather实现首次数据渲染到界面上数据依赖...
2024-01-10
vue怎么写put请求
我是这样写的报错如图求助回答这得看你$http是啥库啊, 比如axios: /** * 重考 * * @param examPaperId * @param studentNo */ examAgain({ examPaperId, studentNo }) { return axios.put('/examInfo/examAgain', { examPaperId, ...
2024-01-10
谷歌Compute Engine的调整大小的启动盘
我只是谷歌计算引擎的文件，在阅读： < < 注：计算引擎正在与相应的操作系统社区和厂商最终将所有的操作系统自动调整根分区。因此，我们建议您偶尔检查以确保操作系统仍然需要执行此步骤，并且随着时间的推移，此步骤将在所有操作系统中完全删除。 >>谷歌Compute Engine的调整大小的启动盘...
2024-01-10
VUE----watch和compute
1.computed:计算属性computed是一个对象，而里面需要计算的属性是一个函数的返回值。计算属性默认只有getter，可以在需要的时候自己设定setter。在data中没有直接声明出要计算的变量，也可以直接在computed中写入。computed适用场景2.computed与methods区别：计算属性是基于它们的响应式依赖进行缓存的。只在...
2024-01-10
vue--vuex详解
Vuex 什么是Vuex？ 官方说法：Vuex 是一个专为 Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 个人理解：Vuex是用来管理组件之间通信的一个插件 为什么要用Vue...
2024-01-10
vue-router定义元信息meta操作
router/index.jsimport Vue from 'vue'import VueRouter from 'vue-router'import Home from '../views/Home.vue'import Test from '../views/Test.vue'import NotFound from '../views/NotFound.vue'import TestChild from '../views/TestChild.vue'import AView from '../vi...
2024-01-10解决vue-router在同一个路由下切换,取不到变化的路由参数问题
最近用vue写项目的时候碰到一个问题，在同一个页面下跳转，路由地址不变，路由参数有变化，一开始只是在data里取路由的参数，发现根本取不到变化的路由参数。在网上查找了一番后发现可以这样写：watch: { '$route' (to, from) { //这样就可以获取到变化的参数了，然后执行参数变化后相应的逻辑就行...
2024-01-10
Vue关于使用vue-router控制视图渲染的问题。
环境：Vue2.0 + vue-router + element-ui + 新手,思路：想通过正则判断vue-router的$route.path来控制SideBar组件的渲染与否，具体代码如下：App.vue<template> <div id="app"> <div class="warper"> <div class="header"> <TopBar></TopBar> </div> <el-row><el-col :span="2" > ...
2024-01-10
petite-vue源码剖析-从静态视图开始
代码库结构介绍examples 各种使用示例scripts 打包发布脚本tests 测试用例srcdirectives v-if等内置指令的实现app.ts createApp函数block.ts 块对象context.ts 上下文对象eval.ts 提供v-if="count === 1"等表达式运算功能scheduler.ts 调度器utils.ts 工具函数walk.ts 模板解析若想构建自己的版本只需在控制台执行npm run bui...
2024-01-10
vue-router 路由懒加载
webpack打包会将所有资源文件合并压缩成一个文件，导致最终的文件非常大，甚至超过几M，以致页面首次加载会比较慢，如下图：其中红色标出的是在浏览器中加载的js文件，gzip压缩前已经达到500多KB了。再看看路由按需加载后：文件被拆成一个个小的文件，即webpack的文件分割。这里是以页面为单位...
2024-01-10
怎么排查 Vue-Router 渲染不出来的问题？
问题描述开发环境vue 3.3.4vue-router@4IDE: vs-code 1.80我尝试跟着 vue-router官方教程 做demo, router-link 渲染了, 但是 router-view 没有渲染. 页面和控制台又没报错。试了好多种方法，检查了关键字是否写错，都不行.请大家帮忙看看, thanks!文件列表main.jsimport { createApp } from '...
2024-02-07
vue-router重定向 不刷新问题
前阵子太忙了，自己一个人一边开发着新项目，一边维护着旧项目，没时间写博客，终于让我腾出时间了。废话少说，开始正文。 问题描述: 之前项目是angular开发的，后来用vue重构后。项目路径和vue路径不一致，但是app端分享出的链接，依旧是旧项目链接。 解决方法： 通过阅读vue-ro...
2024-01-10
vue-router 安装和基本使用
1、安装npm install vue-router --save2、src下创建router文件夹并创建index.js文件 ---- /src/router/index.jsindex.js/* * @Description: web router * @Author: wangwz10@lenovo.com * @LastEditors: wangwz10@lenovo.com * @Date: 2020-05-28 15:48:40 * @LastEditTime: 2021-02-04 10:3...
2024-01-10
Vue --》 如何在vue中调用百度地图
1.项目根目录下下载百度地图插件 npm install vue-baidu-map –save2.在首页index.html中引入百度地图: <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=秘钥"></script> 我申请的**为 ：3bVHdeo2ZZaZO4QczC63d0kMsbA55ZSD3.在显示地图的组件中 template 中： <div class="baidumap" id="a...
2024-01-10vue 运用mock数据的示例代码
本文介绍了vue 运用mock数据的示例代码，分享给大家，具体如下：初始化你的项目话不用啰嗦，首先初始化你的项目，最简单的就是使用vue-cli啦vue init webpack引入mock.js安装 mockjsnpm install --save-dev mockjs引入到Vue原型上，方便使用 import mockjs from 'mockjs' Vue.prototype.$mock = Vue.$mock = mockjs.mock以上引...
2024-01-10
vue中mousewheel滚动
效果点击上下可以中间滚动，鼠标在框内滚动也会滚动。外部jsconst mouseEvent = { wheel(opt){ console.log(opt) if(!opt.target){ console.log('什么都没有，还让我帮忙！'); return ; } let callback = opt.callback || function () {}; let target = ...
2024-01-10
vue-cropper插件实现图片截取上传组件封装
基于vue-cropper插件实现图片截取上传组件封装的具体代码，供大家参考，具体内容如下需求场景：后台开发需要上传图片并进行相应比例尺寸图片的截取,本组件开发采用Ant Design Vue组件库搭配vue-cropper插件进行封装实现如下html<template> <div> <a-upload name="avatar" list-type="picture-card" clas...
2024-01-10
【Web前端问题】Chrome78 拓展程序怎样通过第三方的方式来安装？
版本 78.0.3904.70（正式版本） （64 位）比如这个“迅雷下载安装”的拓展程序，好像是在某个网站上点击后自动就安装了，想知道是通过什么接口来安装的？...
2024-01-10
webstrom设置新建Vue文件、去除右侧边界白线
webstrom设置Vue文件及其模板 Setting --> Editor --> File and Code Templates 点击“+”号设置name为“My Name”,Extension为vue（文件后缀） 模板内容中设置你自己想要设置的内容 apply OK 会弹出一个对话框，选择打开文件的类型选择html格式就好 然后就可以在新...
2024-01-10在vue项目中使用codemirror插件实现代码编辑器功能
在vue项目中使用codemirror插件实现代码编辑器功能（代码高亮显示及自动提示），具体内容如下所示：1、使用npm安装依赖npm install --save codemirror;2、在页面中放入如下代码<template> <textarea ref="mycode" class="codesql" v-model="code" style="height:200px;width:600px;"></textarea></template><script>import "codemirror/th...
2024-01-10
vue使用qrcode插件生成二维码
参考：https://www.jianshu.com/p/d3883e020d99步骤：第一步：vue-cli下载插件cnpm install --save qrcodejs2第二步：组件中引入插件<template> <div> <div id="qrcode"></div> <!-- 创建一个div，并设置id为qrcode --> </div></template> <script>import QRCode from \'qrcodejs2\' // 引入qrcodeexport d...
2024-01-10
webstorm安装vue插件及安装过程出现的问题
想要编辑器识别vue文件需要安装vue插件1. 安装方法： File--> setting --> plugin ，点击plugin，在内容部分的左侧输入框输入vue，会出现1个关于vue的插件，点击安装即可。安装完成后，就可以看到，新建文件时，会有vue文件的提示。 如下图所示：2:vue 使用的是es6语法， 所以要将javascript的版本改...
2024-01-10
【Docker】安装helm失败
问题描述刚学习K8S. 在 (vagrant 虚拟机) k8s集群环境上安装helm。通过helm version,一直提示如下：Client: &version.Version{SemVer:"v2.14.1", GitCommit:"5270352a09c7e8b6e8c9593002a73535276507c0", GitTreeState:"clean"}Error: forwarding ports: error upgrading connection: unable to upgrade co...
2024-01-10Mega 和 SecureSafe 之间的区别
兆丰MEGA 是一种基于云的服务，可以从任何具有 Internet 访问权限的设备或平台访问。它主要是为基于浏览器的应用程序设计的。此外，它还为 Windows、Android 手机和 Apple 手机准备了移动应用程序。MEGA 于 2013 年 1 月 20 日创建，正好是美国政府臭名昭著的摧毁 Megaupload 一年后。它由 Kim Dotcom、Mathias Ortmann ...
2024-01-10
vue 项目引入echarts 添加点击事件操作
main.js中import echarts from 'echarts'Vue.prototype.$echarts = echartsvue文件中_this.calendarChart=_this.$echarts.init(document.getElementById('earlyWarningCalendar'))_this.calendarChart.on('click',function (param) { console.log(param)}) _this.calendarChart...
2024-01-10
where和having区别：
where和having区别：having只能用在group by之后，对分组后的结果进行筛选(即使用having的前提条件是分组)。where肯定在group by 之前，即也在having之前。where后的条件表达式里不允许使用聚合函数，而having可以。Where是一个约束声明，在查询数据库的结果返回之前对数据库中的查询条件进行约束，即在结果...
2024-01-10
使用Vue、React和Koa开发个人博客
前言实习了大半年，又临近毕业，一直想做一个属于自己的博客。于是就用Vue、React和Koa开发了一个服务端渲染的博客系统。其中： - 后端管理使用Vue开发 - 前端页面使用React服务端渲染框架nextjs - 接口服务使用Koa2 + mongodb + mongoose（使用nodemailer当接口发生500时向我发送邮件通知）项目地址是点我访...
2024-01-10
vue与react的区别
1.创建者等react是Facebook公司创建的js框架，并创新了新的语法，JSX（html in javascript），而vue相对来说更容易学习，且使用模板系统，Reat与Vue只有框架的骨架，其他的功能如路由、状态管理等是框架分离的组件。2.关于虚拟dom改变真实的DOM状态远比改变一个JavaScript对象的花销要大得多。·Virtual DOM是一...
2024-01-10
react和vue对比
相同点都支持服务器端渲染都有Virtual DOM,组件化开发,通过props参数进行父子组件数据的传递,都实现webComponent规范数据驱动视图都有支持native的方案,React的React native,Vue的weex不同点React严格上只针对MVC的view层,Vue则是MVVM模式virtual DOM不一样,vue会跟踪每一个组件的依赖关系,不需要重新渲染整个组件...
2024-01-10
浅谈vue和react的数据流和绑定
就数据流来说：Vue和React均是单向数据流传递，举个例子：单向数据流指只能从一个方向修改数据，姑且我们可以这样理解，如下图所示。一个父组件下有两个子组件1和子组件2，父组件可以向子组件传递数据。假如子组件都获取到了父组件的name，在子组件1中对name重新修改之后，子组件2和父组件中的...
2024-01-10
vue清除定时器，clearInterval
let time = 10 let intervalFunc = window.setInterval(() => { time = time - 1 if (time < 1) { window.clearInterval(intervalFunc) } }, 1000)...
2024-01-10
Vue页面切换和a链接的本质区别详解
Vue-router是伴随着Vue框架出现的路由系统，它也是公认的一种优秀的路由解决方案。在使用Vue-router时候，我们常常会使用其自带的路径跳转组件Link,通过<Link to="path"></Link>实现跳转，这和传统的<a href="path" rel="external nofollow" ></a>何其相似！但它们到底有什么具体的区别呢？对比<a>，Link组件避免了不必要...
2024-01-10Vue之Watcher源码解析（1）
上一节最后再次调用了mount函数，我发现竟然跳到了7000多行的那个函数，之前我还说因为声明早了被覆盖，看来我错了！就是这个函数：// Line-7531 Vue$3.prototype.$mount = function(el, hydrating) { el = el && inBrowser ? query(el) : undefined; return mountComponent(this, el, hydrating) };第一步query就不用看了，el此时是一...
2024-01-10
